<template>
  <div>
    <el-input v-model="EMPLOYEE_NAME" readonly placeholder="往来客户" class="search-input">
      <i slot="suffix" class="el-input__icon el-icon-circle-plus" @click="openDia"/>
    </el-input>
    <el-dialog
      ref="dialog"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="dialogFormVisible"
      :append-to-body="true"
      title="往来客户选择"
      width="50%">
      <!-- 查询条件 -->
      <el-form ref="searchForm" :inline="true" :model="search" size="mini">
        <el-form-item prop="CUSTOMER_CODE" label="客户代码">
          <el-input v-model="search.CUSTOMER_CODE" placeholder="客户代码" class="search-input"/>
        </el-form-item>
        <el-form-item prop="CUSTOMER_NAME" label="客户名称">
          <el-input v-model="search.CUSTOMER_NAME" placeholder="客户名称" class="search-input"/>
        </el-form-item>

        <br>
        <div style="text-align:right">
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              @click="searchHandle">查询
            </el-button>
          </el-form-item>
          <el-form-item>
            <el-button
              icon="el-icon-refresh"
              @click="resetForm('searchForm')">重置
            </el-button>
          </el-form-item>
        </div>
      </el-form>
      <!-- 用户列表 -->
      <BaseTable
        ref="table"
        highlight-current-row="true"
        @chaneg-size="changeSizeHandle"
        @chaneg-page="changePageHandle"
        @current-change="handleSelectionChange">
        <el-table-column label="序号" type="index" />
        <el-table-column
          prop="CUSTOMER_CODE"
          label="客户代码"/>
        <el-table-column
          prop="CUSTOMER_NAME"
          label="客户名称"/>
        <el-table-column
          prop="DATA_SOURCES"
          label="数据来源">
          <template slot-scope="scope">
            <filtercode v-model="scope.row.DATA_SOURCES" type="1045" />
          </template>
        </el-table-column>
      </BaseTable>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmHandle">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { searchCustomerReo } from '@/api/admin/org/gms/customerReoAccount'
import filtercode from '@/components/Checkbox/filtercode'
import BaseTable from '@/components/BaseTable'
import formMixins from '@/mixins/formMixins'
export default {
  name: 'SelectPartCustomer',
  components: {
    BaseTable,
    filtercode
  },
  mixins: [formMixins],
  props: {},
  data() {
    return {
      dialogFormVisible: false,
      search: {
        limit: 10,
        pageNum: 1,
        CUSTOMER_CODE: '',
        CUSTOMER_NAME: ''
      },
      EMPLOYEE_NAME: ''
    }
  },
  computed: {},
  mounted() {
    this.searchHandle()
  },
  methods: {
    searchHandle() {
      const table = this.$refs['table']
      searchCustomerReo(this.search)
        .then(res => {
          table.complete().filData(res)
        })
        .catch(err => {
          table.complete()
        })
    },
    openDia() {
      this.dialogFormVisible = true
    },
    confirmHandle() {
      if (this.EMPLOYEE_NAME !== '') {
        this.dialogFormVisible = false
      }
    },
    handleSelectionChange(val) {
      debugger
      this.EMPLOYEE_NAME = val.CUSTOMER_NAME
      this.$emit('getCustomerInfo', val)
    }

  }
}
</script>

<style scoped>
</style>
